<template>
    <div>
        <el-card class="box-card">
            <div slot="header" class="clearfix">
                <span>点评门店详情</span>
                <el-button type="text" size="mini" @click="getShopService">
                    shopservice
                </el-button>
                <el-button type="text" size="mini" @click="getRankInfo">
                    rankinfo
                </el-button>
                <el-button type="text" size="mini" @click="getShopTuan">
                    shoptuan
                </el-button>
                <el-button type="text" size="mini" @click="getShopMenu">
                    shopmenu
                </el-button>
                <el-button type="text" size="mini" @click="getShopInfo">
                    shopinfo
                </el-button>
                <el-button type="text" size="mini" @click="getShopBin">
                    shopbin
                </el-button>
                <el-button type="text" size="mini" @click="getShopOther">
                    shopother
                </el-button>
                <el-button type="text" size="mini" @click="getShopCooperation">
                    cooperation
                </el-button>
                <el-button style="float: right; padding: 3px 0" type="text" @click="goBack">返回</el-button>
            </div>
            <div>
                <el-form ref="searchForm" :inline="true" label-suffix="" label-width="100px"
                         size="small" label-position="left">
                    <el-row>
                        <el-col>
                            <el-form-item>
                                <el-button size="small" type="success" @click="setCookie">
                                    参数设置
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="success" @click="syncReserveDialogVisible = true">
                                    同步预定数据
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="success" @click="syncFeedbackDialogVisible = true">
                                    同步评价数据
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="success" @click="viewCpc">
                                    查看CPC竞价
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="success" @click="addRank">
                                    添加榜单
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="primary" @click="onRefresh(dpShop)">
                                    刷新
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="primary" @click="syncDialogVisible = true">
                                    同步数据
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="danger" @click="viewAnalysis(dpShop)">
                                    数据分析
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="danger" @click="viewSummary(dpShop)">
                                    数据汇总
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="danger" @click="compareShop">
                                    门店对比
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="danger" @click="compareDate">
                                    日期对比
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="danger" @click="clearCache(dpShop)">
                                    清除缓存
                                </el-button>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
            <el-descriptions title="" direction="vertical" :column="2" border size="small">
                <el-descriptions-item label="门店名称" label-class-name="my-label">
                    <el-link>{{ dpShop.shopName }}</el-link>
                </el-descriptions-item>
                <el-descriptions-item label="榜单" label-class-name="my-label">
                    <el-link @click="clickRank">{{ dpShop.rankNameEx }}</el-link>
                </el-descriptions-item>
            </el-descriptions>
            <el-descriptions title="" direction="vertical" :column="10" border size="small">
                <el-descriptions-item label="门店ID">
                    {{ dpShop.shopId }}
                </el-descriptions-item>
                <el-descriptions-item label="门店UUID">
                    {{ dpShop.shopUuid }}
                </el-descriptions-item>
                <el-descriptions-item label="位置ID">
                    {{ dpShop.poiId }}
                </el-descriptions-item>
                <el-descriptions-item label="人均">
                    {{ dpShop.avgPrice }}
                </el-descriptions-item>
                <el-descriptions-item label="大分">
                    {{ dpShop.mainScore }}
                </el-descriptions-item>
                <el-descriptions-item label="口味分">
                    {{ dpShop.tasteScore }}
                </el-descriptions-item>
                <el-descriptions-item label="环境分">
                    {{ dpShop.envScore }}
                </el-descriptions-item>
                <el-descriptions-item label="服务分">
                    {{ dpShop.serviceScore }}
                </el-descriptions-item>
                <el-descriptions-item label="食材分">
                    {{ dpShop.foodScore }}
                </el-descriptions-item>
                <el-descriptions-item label="评论数量">
                    {{ dpShop.reviewCount }}
                </el-descriptions-item>
                <el-descriptions-item label="门店分类">
                    {{ dpShop.categoryName }}
                </el-descriptions-item>
                <el-descriptions-item label="城市">
                    {{ dpShop.cityName }}
                </el-descriptions-item>
                <el-descriptions-item label="是否每日同步">
                    <el-switch
                        v-model="dpShop.status"
                        @change="changeStatus"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </el-descriptions-item>
                <!--
                <el-descriptions-item label="是否同步CPC">
                    <el-switch
                        v-model="dpShop.syncCpcStatus"
                        @change="changeStatus"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </el-descriptions-item>
                -->
                <el-descriptions-item label="是否开通过推广通">
                    <el-switch
                        v-model="dpShop.cpcFlag"
                        @change="changeStatus"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </el-descriptions-item>
                <el-descriptions-item label="是否提前同步团代销量">
                    <el-switch
                        v-model="dpShop.syncExtraDataStatus"
                        @change="changeStatus"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </el-descriptions-item>
                <el-descriptions-item label="是否同步评价">
                    <el-switch
                        v-model="dpShop.syncFeedbackStatus"
                        @change="changeFeedbackStatus"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </el-descriptions-item>
                <!--
                <el-descriptions-item label="是否预生成回复内容">
                    <el-switch
                        v-model="dpShop.feedbackPreAiFlag"
                        @change="changeStatus"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                    </el-switch>
                </el-descriptions-item>
                -->
                <el-descriptions-item label="最新同步日期">
                    {{ dpShop.syncDate }}
                </el-descriptions-item>
                <el-descriptions-item label="上次预定同步结束日期">
                    {{ dpShop.lastReserveEndDate }}
                </el-descriptions-item>
                <el-descriptions-item label="上次评价同步结束日期">
                    {{ dpShop.lastFeedbackEndDate }}
                </el-descriptions-item>
                <el-descriptions-item label="评价Cookie" v-if="dpShop.reserveCookie">
                    <table-popover :text=dpShop.reserveCookie :length="24" placeholder="查看"></table-popover>
                </el-descriptions-item>
                <el-descriptions-item label="推广通Cookie" v-if="dpShop.promotionCookie">
                    <table-popover :text=dpShop.promotionCookie :length="24" placeholder="查看"></table-popover>
                </el-descriptions-item>
                <el-descriptions-item label="谁创建的">
                    {{ dpShop.createBy }}
                </el-descriptions-item>
                <el-descriptions-item label="收藏量">
                    {{ dpShop.favorNum }}
                </el-descriptions-item>
                <el-descriptions-item label="收藏日期">
                    {{ dpShop.favorSyncDate }}
                </el-descriptions-item>
                <el-descriptions-item label="同步评价间隔天数">
                    {{ dpShop.feedbackIntervalDays }}
                </el-descriptions-item>
                <el-descriptions-item label="附加字段1">
                    <el-link>{{ dpShop.extraField1 }}</el-link>
                </el-descriptions-item>
                <el-descriptions-item label="附加字段2">
                    <el-link>{{ dpShop.extraField2 }}</el-link>
                </el-descriptions-item>
                <el-descriptions-item label="附加字段3">
                    <el-link>{{ dpShop.extraField3 }}</el-link>
                </el-descriptions-item>
                <el-descriptions-item label="附加字段4">
                    <el-link>{{ dpShop.extraField4 }}</el-link>
                </el-descriptions-item>
                <el-descriptions-item label="附加字段5">
                    <el-link>{{ dpShop.extraField5 }}</el-link>
                </el-descriptions-item>
            </el-descriptions>
            <el-divider content-position="left">点评5图</el-divider>
            <div>
                <el-form ref="searchForm" :inline="true" label-suffix="" label-width="100px"
                         size="small" label-position="left">
                    <el-row>
                        <el-col>
                            <el-form-item>
                                <el-button size="small" type="warning"
                                           @click="fivePicShowFlag = !fivePicShowFlag">
                                    {{ fivePicShowFlag ? '隐藏5图' : '显示5图' }}
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="success" @click="galleryAdd5Pic('FIVE_PIC')">
                                    5图添加到图库
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="success" @click="galleryAddVideo">
                                    视频添加到图库
                                </el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button size="small" type="primary"
                                           @click="fivePicMode = fivePicMode === 'cover' ? 'contain' : 'cover'">
                                    切换显示
                                </el-button>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
            <div class="pics" v-if="fivePicShowFlag">
                <el-row>
                    <el-col :span="4" v-for="item in pics" :key="item.id">
                        <el-image :src="item.thumbUrl" :fit="fivePicMode" :preview-src-list="picUrls"
                                  class="pic"></el-image>
                    </el-col>
                    <el-col :span="4">
                        <div class="pic" v-if="videoUrl">
                            <video :src="videoUrl" controls style="width: 100%; height: 100%; object-fit:fill"></video>
                        </div>
                    </el-col>
                </el-row>
            </div>
        </el-card>

        <el-tabs v-model="activeName" @tab-click="handleTabClick">
            <el-tab-pane label="数据历史" name="dataHistory">
                <dp-shop-history :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                                 v-if="activeName==='dataHistory'"></dp-shop-history>
            </el-tab-pane>
            <el-tab-pane label="榜单收藏量" name="rankFavor">
                <dp-rank-shop :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                              v-if="activeName==='rankFavor'"></dp-rank-shop>
            </el-tab-pane>
            <!--
            <el-tab-pane label="招牌菜" name="specialDishes">
                <div>
                    <el-form ref="searchForm" :inline="true" label-suffix="" label-width="100px"
                             size="small" label-position="left">
                        <el-row>
                            <el-col>
                                <el-form-item>
                                    <el-button size="small" type="warning" @click="specialShowFlag = !specialShowFlag">
                                        {{ specialShowFlag ? '隐藏招牌菜' : '显示招牌菜' }}
                                    </el-button>
                                </el-form-item>
                                <el-form-item>
                                    <el-button size="small" type="success" @click="syncSpecialDialogVisible = true">
                                        同步招牌菜
                                    </el-button>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </div>
                <div v-if="specialShowFlag">
                    <el-row v-for="item in specialRowsData" :key="item.id">
                        <el-col :span="4" v-for="col in item.cols" :key="item.id">
                            <el-image :src="col.imgUrl" fit="cover" :preview-src-list="specialImgUrls"
                                      class="pic"></el-image>
                            <div style="margin-top: -5px">
                                <el-link type="primary"
                                         :href="col.url"
                                         target="_blank">
                                    {{ col.name }}
                                </el-link>
                                <el-button size="small" type="success" icon="el-icon-plus" circle
                                           @click="galleryAddImage(col)"></el-button>
                            </div>
                        </el-col>
                    </el-row>
                </div>
            </el-tab-pane>
            -->
            <el-tab-pane label="菜单图片" name="menu">
                <div>
                    <el-form ref="searchForm" :inline="true" label-suffix="" label-width="100px"
                             size="small" label-position="left">
                        <el-row>
                            <el-col>
                                <el-form-item>
                                    <el-button size="small" type="warning" @click="menuShowFlag = !menuShowFlag">
                                        {{ menuShowFlag ? '隐藏菜单' : '显示菜单' }}
                                    </el-button>
                                </el-form-item>
                                <el-form-item>
                                    <el-button size="small" type="success" @click="syncMenu">
                                        同步菜单
                                    </el-button>
                                </el-form-item>
                                <el-form-item>
                                    <el-button size="small" type="primary" @click="menuShowStyle = !menuShowStyle">
                                        切换显示
                                    </el-button>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </div>
                <div v-if="menuShowFlag">
                    <div class="menu-pics" v-show="menuShowStyle">
                        <div v-for="item in menuRowsData" :key="item.id">
                            <el-row>
                                <el-col :span="4" v-for="col in item.cols" :key="item.id">
                                    <el-image :src="col" fit="cover" :preview-src-list="menuImgUrls"
                                              class="menu-pic"></el-image>
                                </el-col>
                            </el-row>
                            <el-divider content-position="left">
                                <el-link type="success" @click="menuAdd(item.cols)">添加到相册</el-link>
                            </el-divider>
                        </div>
                    </div>
                    <div v-show="!menuShowStyle">
                        <div v-for="item in menuRowsData" :key="item.id">
                            <el-row>
                                <el-col :span="6" v-for="col in item.cols" :key="item.id">
                                    <el-image :src="col" fit="cover" :preview-src-list="menuImgUrls"></el-image>
                                </el-col>
                            </el-row>
                            <el-divider content-position="left">
                                <el-link type="success" @click="menuAdd(item.cols)">添加到相册</el-link>
                            </el-divider>
                        </div>
                    </div>
                </div>
            </el-tab-pane>
            <!--
            <el-tab-pane label="预定数据" name="reserveData">
                <dp-reserve :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                            v-if="activeName==='reserveData'"></dp-reserve>
            </el-tab-pane>
            -->
            <el-tab-pane label="评价数据" name="feedbackData">
                <dp-feedback :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                             v-if="activeName==='feedbackData'"></dp-feedback>
            </el-tab-pane>
            <el-tab-pane label="通知配置" name="pushConfig">
                <dp-push-config :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                                v-if="activeName==='pushConfig'"></dp-push-config>
            </el-tab-pane>
            <el-tab-pane label="CPC竞价" name="cpcData">
                <dp-cpc-bid :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                            v-if="activeName==='cpcData'"></dp-cpc-bid>
            </el-tab-pane>
            <el-tab-pane label="CPC推广" name="cpcPlan">
                <dp-cpc-plan :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                             v-if="activeName==='cpcPlan'"></dp-cpc-plan>
            </el-tab-pane>
            <el-tab-pane label="自然数据" name="dailyData">
                <dp-daily-data :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                               v-if="activeName==='dailyData'"></dp-daily-data>
            </el-tab-pane>
            <el-tab-pane label="营业收入" name="revenue">
                <dp-revenue :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                            v-if="activeName==='revenue'"></dp-revenue>
            </el-tab-pane>
            <el-tab-pane label="浏览量" name="pageView">
                <dp-page-view :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                              v-if="activeName==='pageView'"></dp-page-view>
            </el-tab-pane>
            <el-tab-pane label="团代销量" name="consumeSummary">
                <dp-consume-summary :shop-id="shopId" :shop-name="dpShop.shopName" size="small"
                                    v-if="activeName==='consumeSummary'"></dp-consume-summary>
            </el-tab-pane>
            <!--            <el-tab-pane label="团购/代金券" name="tuan">-->
            <!--                <dp-tuan :shop-id="shopId" :shop-name="dpShop.shopName" size="small"-->
            <!--                         v-if="activeName==='tuan'"></dp-tuan>-->
            <!--            </el-tab-pane>-->
            <!--            <el-tab-pane label="门店入口图" name="entryPic">-->
            <!--                <dp-entry-pic :shop-id="shopId" :shop-name="dpShop.shopName" size="small"-->
            <!--                              v-if="activeName==='entryPic'"></dp-entry-pic>-->
            <!--            </el-tab-pane>-->
        </el-tabs>

        <el-dialog title="参数设置" width="50%" :visible.sync="cookieDialogVisible">
            <el-form :model="cookieForm" label-width="160px" size="small">
                <el-form-item :label="reserveCookieLabel">
                    <el-input v-model="cookieForm.reserveCookie" placeholder="评价Cookie" :autosize="{ minRows: 2}"
                              type="textarea"></el-input>
                    <div class="form-tips">可用于同步预定数据，评价数据，自然数据，营业收入</div>
                </el-form-item>
                <el-form-item :label="promotionCookieLabel">
                    <el-input v-model="cookieForm.promotionCookie" placeholder="推广通Cookie" :autosize="{ minRows: 2}"
                              type="textarea"></el-input>
                    <div class="form-tips">可用于CPC竞价，CPC推广，浏览量</div>
                </el-form-item>
                <el-form-item label="同步门店" prop="shopName">
                    <el-select v-model="cookieForm.shopIdList" filterable multiple placeholder="请选择">
                        <el-option
                            v-for="item in allShops"
                            :key="item.id"
                            :label="item.shopName"
                            :value="item.shopId">
                        </el-option>
                    </el-select>
                    <div class="form-tips">
                        Cookie同步门店，可选择多家门店，通常适用于开店宝账号关联多家门店，连锁店情况，一定不要选错了
                    </div>
                </el-form-item>
                <el-form-item label="位置ID">
                    <el-input v-model="cookieForm.poiId" placeholder="位置ID"></el-input>
                </el-form-item>
                <el-form-item label="同步评价间隔天数">
                    <el-input v-model="cookieForm.feedbackIntervalDays" placeholder="同步评价间隔天数"></el-input>
                </el-form-item>
                <el-form-item label="附加字段1">
                    <el-input v-model="cookieForm.extraField1" placeholder="附加字段1"></el-input>
                    <div class="form-tips">推广通，数据报告，竞争分析，getCompeteDataV2接口area字段</div>
                </el-form-item>
                <el-form-item label="附加字段2">
                    <el-input v-model="cookieForm.extraField2" placeholder="附加字段2"></el-input>
                    <div class="form-tips">推广通，数据报告，竞争分析，getCompeteDataV2接口category字段</div>
                </el-form-item>
                <el-form-item label="附加字段3">
                    <el-input v-model="cookieForm.extraField3" placeholder="附加字段3"></el-input>
                </el-form-item>
                <el-form-item label="附加字段4">
                    <el-input v-model="cookieForm.extraField4" placeholder="附加字段4"></el-input>
                </el-form-item>
                <el-form-item label="附加字段5">
                    <el-input v-model="cookieForm.extraField5" placeholder="附加字段5"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cookieDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="setCookieConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="同步预定数据" width="30%" :visible.sync="syncReserveDialogVisible">
            <el-form :model="syncReserveForm" label-width="120px" size="small">
                <el-form-item label="本次起始日期" prop="syncDate">
                    <el-date-picker
                        v-model="syncReserveForm.startDate"
                        :disabled="syncReserveForm.lastReserveEndDate"
                        type="date"
                        placeholder="本次起始日期"
                        value-format="yyyy-MM-dd"
                        align="right">
                    </el-date-picker>
                    <div class="form-tips">
                        也就是上次结束日期！
                    </div>
                </el-form-item>
                <el-form-item label="本次结束日期" prop="syncDate">
                    <el-date-picker
                        v-model="syncReserveForm.endDate"
                        type="date"
                        placeholder="本次结束日期"
                        value-format="yyyy-MM-dd"
                        align="right">
                    </el-date-picker>
                    <div class="form-tips">
                        最长间隔时间不能超过一年！
                    </div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="syncReserveDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="syncReserveConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="同步评价数据" width="30%" :visible.sync="syncFeedbackDialogVisible">
            <el-form :model="syncFeedbackForm" label-width="120px" size="small">
                <el-form-item label="本次起始日期" prop="syncDate">
                    <el-date-picker
                        v-model="syncFeedbackForm.startDate"
                        :disabled="syncFeedbackForm.lastFeedbackEndDate"
                        type="date"
                        placeholder="本次起始日期"
                        value-format="yyyy-MM-dd"
                        align="right">
                    </el-date-picker>
                    <div class="form-tips">
                        也就是上次结束日期！
                    </div>
                </el-form-item>
                <el-form-item label="本次结束日期" prop="syncDate">
                    <el-date-picker
                        v-model="syncFeedbackForm.endDate"
                        type="date"
                        placeholder="本次结束日期"
                        value-format="yyyy-MM-dd"
                        align="right">
                    </el-date-picker>
                    <div class="form-tips">
                        最长间隔时间不能超过一年！
                    </div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="syncFeedbackDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="syncFeedbackConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="同步招牌菜" width="30%" :visible.sync="syncSpecialDialogVisible">
            <el-form :model="specialForm" label-width="120px" size="small">
                <el-form-item label="某道招牌菜ID">
                    <el-input v-model="specialForm.dishId" placeholder="请输入某道招牌菜ID"
                              type="textarea"></el-input>
                </el-form-item>
                <el-form-item>
                    <div class="form-tips">
                        获取方式：打开大众点评APP，招牌菜，点击其中某道招牌菜，点击分享，复制链接，链接里面就包含了招牌菜ID
                    </div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="syncSpecialDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="syncSpecialConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="同步数据" width="40%" :visible.sync="syncDialogVisible">
            <el-form :model="syncForm" label-width="120px" size="small">
                <el-form-item label="请选择同步日期">
                    <el-select v-model="syncForm.daysType" placeholder="请选择" clearable>
                        <el-option label="昨天" value="YESTERDAY"></el-option>
                        <el-option label="近三天" value="THREE"></el-option>
                        <el-option label="近七天" value="SEVEN"></el-option>
                        <el-option label="近十天" value="TEN"></el-option>
                        <el-option label="近30天" value="THIRTY"></el-option>
                        <el-option label="自定义" value="USER_DEFINE"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="请选择日期" v-if="syncForm.daysType === 'USER_DEFINE'">
                    <el-date-picker
                        v-model="syncForm.dateRange"
                        value-format="yyyy-MM-dd"
                        unlink-panels
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :picker-options="this.CONST.analysis_date_options">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="请选择同步项目">
                    <el-checkbox-group v-model="syncForm.itemList">
                        <el-checkbox label="cpc">CPC</el-checkbox>
                        <el-checkbox label="dailyData">自然数据</el-checkbox>
                        <el-checkbox label="revenue">营业收入</el-checkbox>
                        <el-checkbox label="pageView">浏览量</el-checkbox>
                        <el-checkbox label="consumeSummary">团代销量</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="syncDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="syncConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="添加门店对比" width="30%" :visible.sync="compareShopDialogVisible">
            <el-form :model="compareShopForm" label-width="120px" size="small">
                <el-form-item label="请选择门店" prop="shopName">
                    <el-select v-model="compareShopForm.shopIds" filterable multiple placeholder="请选择">
                        <el-option
                            v-for="item in allShops"
                            :key="item.id"
                            :label="item.shopName"
                            :value="item.shopId">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="compareShopDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="compareShopConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="添加日期对比" width="40%" :visible.sync="compareDateDialogVisible">
            <el-form :model="compareDateForm" label-width="120px" size="small">
                <el-form-item label="请选择日期1">
                    <el-date-picker
                        v-model="compareDateForm.dateRange1"
                        value-format="yyyy-MM-dd"
                        unlink-panels
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :picker-options="this.CONST.analysis_date_options">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="请选择日期2">
                    <el-date-picker
                        v-model="compareDateForm.dateRange2"
                        value-format="yyyy-MM-dd"
                        unlink-panels
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :picker-options="this.CONST.analysis_date_options">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="请选择日期3">
                    <el-date-picker
                        v-model="compareDateForm.dateRange3"
                        value-format="yyyy-MM-dd"
                        unlink-panels
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        :picker-options="this.CONST.analysis_date_options">
                    </el-date-picker>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="text" size="small" @click="getLast2Week">最近2周</el-button>
                <el-button type="text" size="small" @click="getLast3Week">最近3周</el-button>
                <el-button type="text" size="small" @click="getLast2Month">最近2月</el-button>
                <el-button type="text" size="small" @click="getLast3Month">最近3月</el-button>
                <el-button @click="compareDateDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="compareDateConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog :title="cpcDialogTitle" width="40%" :visible.sync="cpcViewDialogVisible">
            <div>大众点评竞价</div>
            <el-descriptions title="" direction="vertical" :column="6" border size="mini">
                <el-descriptions-item label="第3名">{{ cpcInfo.dp3thBid }}</el-descriptions-item>
                <el-descriptions-item label="第8名">{{ cpcInfo.dp8thBid }}</el-descriptions-item>
                <el-descriptions-item label="第13名">{{ cpcInfo.dp13thBid }}</el-descriptions-item>
                <el-descriptions-item label="第18名">{{ cpcInfo.dp18thBid }}</el-descriptions-item>
                <el-descriptions-item label="第23名">{{ cpcInfo.dp23thBid }}</el-descriptions-item>
                <el-descriptions-item label="第28名">{{ cpcInfo.dp28thBid }}</el-descriptions-item>
            </el-descriptions>
            <div>美团竞价</div>
            <el-descriptions title="" direction="vertical" :column="6" border size="mini">
                <el-descriptions-item label="第3名">{{ cpcInfo.mt3thBid }}</el-descriptions-item>
                <el-descriptions-item label="第8名">{{ cpcInfo.mt8thBid }}</el-descriptions-item>
                <el-descriptions-item label="第13名">{{ cpcInfo.mt13thBid }}</el-descriptions-item>
                <el-descriptions-item label="第18名">{{ cpcInfo.mt18thBid }}</el-descriptions-item>
                <el-descriptions-item label="第23名">{{ cpcInfo.mt23thBid }}</el-descriptions-item>
                <el-descriptions-item label="第28名">{{ cpcInfo.mt28thBid }}</el-descriptions-item>
            </el-descriptions>
            <div>建议指标</div>
            <el-descriptions title="" :column="2" border size="mini">
                <el-descriptions-item label="建议点评出价">{{ cpcInfo.suggestDpBid }}</el-descriptions-item>
                <el-descriptions-item label="建议美团出价">{{ cpcInfo.suggestMtBid }}</el-descriptions-item>
                <el-descriptions-item label="建议预算">{{ cpcInfo.suggestBudget }}</el-descriptions-item>
                <el-descriptions-item label="建议预算上浮">{{ cpcInfo.suggestBudgetFloat }}%</el-descriptions-item>
                <el-descriptions-item label="建议点评关键词出价">{{ cpcInfo.suggestKeywordDpBid }}
                </el-descriptions-item>
                <el-descriptions-item label="建议美团关键词出价">{{ cpcInfo.suggestKeywordMtBid }}
                </el-descriptions-item>
            </el-descriptions>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cpcViewDialogVisible = false" type="primary" size="small">关 闭</el-button>
            </div>
        </el-dialog>

        <el-dialog title="添加到美食图库" width="40%" :visible.sync="galleryAddDialogVisible">
            <el-form :model="galleryAddForm" label-width="120px" size="small">
                <el-form-item label="菜系分类">
                    <el-select v-model="galleryAddForm.foodCategory"
                               placeholder="美食分类">
                        <el-option
                            v-for="item in shop_categories"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="类型">
                    <el-select v-model="galleryAddForm.type"
                               placeholder="类型">
                        <el-option label="视频"
                                   value="VIDEO"></el-option>
                        <el-option label="图片"
                                   value="IMAGE"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="名称">
                    <el-input v-model="galleryAddForm.name"
                              placeholder="名称"></el-input>
                </el-form-item>
                <el-form-item label="素材来源">
                    <el-select v-model="galleryAddForm.source"
                               placeholder="素材来源">
                        <el-option label="点评"
                                   value="DP"></el-option>
                        <el-option label="其它"
                                   value="OTHERS"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="风格标签">
                    <el-tag
                        v-for="item in style_tags"
                        :key="item.label"
                        :type="item.type"
                        size="small"
                        @click="clickStyleTag(item)"
                        :effect="item.effect">
                        {{ item.label }}
                    </el-tag>
                </el-form-item>
                <el-form-item label="内容标签" v-if="content_tags.length > 0">
                    <el-tag
                        v-for="item in content_tags"
                        :key="item.label"
                        :type="item.type"
                        size="small"
                        @click="clickContentTag(item)"
                        :effect="item.effect">
                        {{ item.label }}
                    </el-tag>
                </el-form-item>
                <el-form-item label="门店名称">
                    <el-input v-model="galleryAddForm.shopName"
                              placeholder="门店名称"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="galleryAddDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="galleryAddConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog :title="galleryAdd5PicTitle" width="40%" :visible.sync="galleryAdd5PicDialogVisible">
            <el-form :model="galleryAddForm" label-width="120px" size="small">
                <el-form-item label="菜系分类">
                    <el-select v-model="galleryAddForm.foodCategory"
                               placeholder="美食分类">
                        <el-option
                            v-for="item in shop_categories"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="风格标签">
                    <el-tag
                        v-for="item in style_tags"
                        :key="item.label"
                        :type="item.type"
                        size="small"
                        @click="clickStyleTag(item)"
                        :effect="item.effect">
                        {{ item.label }}
                    </el-tag>
                </el-form-item>
                <el-form-item label="门店名称">
                    <el-input v-model="galleryAddForm.shopName"
                              placeholder="门店名称"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="galleryAdd5PicDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="galleryAdd5PicConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="添加榜单" width="30%" :visible.sync="addRankDialogVisible">
            <el-form :model="addRankForm" label-width="120px" size="small">
                <el-form-item label="城市">
                    <el-input v-model="addRankForm.city" placeholder="城市"></el-input>
                </el-form-item>
                <el-form-item label="区域">
                    <el-input v-model="addRankForm.district" placeholder="区域"></el-input>
                    <div class="form-tips">可填全城</div>
                </el-form-item>
                <el-form-item label="商圈">
                    <el-input v-model="addRankForm.region" placeholder="商圈"></el-input>
                    <div class="form-tips">可填全部商圈</div>
                </el-form-item>
                <el-form-item label="美食分类">
                    <el-select v-model="addRankForm.foodCategory" filterable placeholder="请选择">
                        <el-option
                            v-for="item in foodCategories"
                            :key="item"
                            :label="item"
                            :value="item">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="榜单类型">
                    <el-select v-model="addRankForm.rankType" filterable placeholder="请选择">
                        <el-option
                            v-for="item in rankTypes"
                            :key="item"
                            :label="item"
                            :value="item">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="是否每日同步">
                    <el-switch v-model="addRankForm.syncStatus"></el-switch>
                </el-form-item>
                <el-form-item label="是否收藏">
                    <el-switch v-model="addRankForm.favoriteFlag"></el-switch>
                </el-form-item>
                <el-form-item label="顺序">
                    <el-input v-model="addRankForm.order" placeholder="顺序"
                              oninput="value=value.replace(/[^\d]/g,'')"></el-input>
                    <div class="form-tips">
                        值越大显示越靠前！
                    </div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="addRankDialogVisible = false" size="small">取 消</el-button>
                <el-button @click="addRankConfirm" type="primary" size="small">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import {
    addDpRank,
    addFromDp5pic,
    addFromDpMenu,
    addGalleryFromDp,
    clearDpCache,
    getAllShops,
    getDpRankByRankKey,
    getDpShopByShopId,
    getDpSpecialDishByPage,
    getLastNMonth,
    getLastNWeek,
    getParamValue,
    parseDpRankInfo,
    refreshDpShop,
    syncDpShopData,
    syncDpShopFeedbackData,
    syncDpShopMenu,
    syncDpShopReserveData,
    syncDpShopSpecialDish,
    updateDpShop,
    updateDpShopParam,
    viewCpcNow
} from '@/api/api'
import DpShopHistory from "@/component/DpShopHistory";
import DpReserve from "@/component/DpReserve";
import DpCpcBid from "@/component/DpCpcBid";
import DpCpcPlan from "@/component/DpCpcPlan";
import DpDailyData from "@/component/DpDailyData";
import DpEntryPic from "@/component/DpEntryPic";
import DpFeedback from "@/component/DpFeedback";
import DpPushConfig from "@/component/DpPushConfig";
import DpRankShop from "@/component/DpRankShop";
import DpTuan from "@/component/DpTuan";
import DpRevenue from "@/component/DpRevenue";
import DpPageView from "@/component/DpPageView";
import DpConsumeSummary from "@/component/DpConsumeSummary";
import TablePopover from "@/component/single/TablePopover";

export default {
    name: "dpShopDetail",
    components: {
        TablePopover,
        DpShopHistory,
        DpReserve,
        DpFeedback,
        DpCpcBid,
        DpCpcPlan,
        DpDailyData,
        DpEntryPic,
        DpPushConfig,
        DpRankShop,
        DpTuan,
        DpRevenue,
        DpPageView,
        DpConsumeSummary
    },
    data() {
        return {
            // 点评门店详情
            dpShop: {},
            // 点评门店shopId
            shopId: '',
            // 点评5图
            pics: [],
            // 点评5图链接数组
            picUrls: [],
            // 视频链接
            videoUrl: '',

            cookieDialogVisible: false,
            cookieForm: {
                reserveCookie: '',
                promotionCookie: '',
                poiId: '',
                feedbackIntervalDays: 3,
                extraField1: '',
                extraField2: '',
                extraField3: '',
                extraField4: '',
                extraField5: '',
                shopIdList: [],
            },

            syncReserveDialogVisible: false,
            syncReserveForm: {
                startDate: '',
                lastReserveEndDate: '',
            },

            syncFeedbackDialogVisible: false,
            syncFeedbackForm: {
                startDate: '',
                lastFeedbackEndDate: '',
            },

            syncDialogVisible: false,
            syncForm: {
                daysType: null,
                itemList: ['cpc', 'dailyData', 'revenue', 'pageView', 'consumeSummary'],
            },

            cpcViewDialogVisible: false,
            cpcDialogTitle: '',
            cpcInfo: {},

            syncSpecialDialogVisible: false,
            specialForm: {},
            specialDishes: [],
            specialRowsData: [],
            specialImgUrls: [],
            colsSize: 6,
            // 招牌菜默认不显示
            specialShowFlag: false,

            allShops: [],
            compareShopDialogVisible: false,
            compareShopForm: {
                shopIds: [],
            },

            compareDateDialogVisible: false,
            compareDateForm: {
                dateRange1: [],
                dateRange2: [],
                dateRange3: [],
            },

            activeName: 'dataHistory',

            galleryAddDialogVisible: false,
            galleryAddForm: {
                mediaUrl: '',
                type: '',
                name: '',
                shopName: '',
                category: '',
                source: 'DP',
            },

            galleryAdd5PicDialogVisible: false,
            galleryAdd5PicTitle: "",

            style_tags: [],
            content_tags: [],

            // 门店分类
            shop_categories: [],

            // 菜单
            menuImgUrls: [],
            menuRowsData: [],
            menuShowStyle: true,
            menuSelectedRow: [],
            // 菜单图片默认不限时
            menuShowFlag: false,

            // 5图显示标志，默认不显示
            fivePicShowFlag: false,
            // 5图显示模式
            fivePicMode: 'cover',

            // 添加榜单
            addRankForm: {},
            addRankDialogVisible: false,
            // 美食分类
            foodCategories:
                ['全部美食', '火锅', '日本菜', '西餐', '本帮江浙菜', '川菜', '烤肉', '咖啡厅', '自助餐', '烧烤烤串',
                    '粤菜', '韩国料理', '鱼鲜', '湘菜', '东北菜', '私房菜', '东南亚菜', '农家菜', '特色菜', '北京菜',
                    '新疆菜', '创意菜', '家常菜', '小龙虾', '素食', '中东菜', '小吃快餐', '面包甜点', '面馆', '饮品店'],
            // 榜单类型
            rankTypes: ['热门榜', '好评榜', '口味榜', '环境榜', '服务榜'],

            promotionCookieLabel: '推广通Cookie',
            reserveCookieLabel: '评价Cookie',
        }
    },
    watch: {
        $route: function (newVal, oldVal) {
            // let tab = newVal.query.tab;
            // if (tab) {
            //     this.activeName = tab;
            // }
            // this.getData();
        }
    },
    methods: {
        getLast2Week() {
            getLastNWeek(2).then(data => {
                let result = data.body;
                this.compareDateForm.dateRange1 = [];
                this.compareDateForm.dateRange1.push(result[0].startDate);
                this.compareDateForm.dateRange1.push(result[0].endDate);

                this.compareDateForm.dateRange2 = [];
                this.compareDateForm.dateRange2.push(result[1].startDate);
                this.compareDateForm.dateRange2.push(result[1].endDate);

                this.compareDateForm.dateRange3 = [];
            })
        },
        getLast3Week() {
            getLastNWeek(3).then(data => {
                let result = data.body;
                this.compareDateForm.dateRange1 = [];
                this.compareDateForm.dateRange1.push(result[0].startDate);
                this.compareDateForm.dateRange1.push(result[0].endDate);

                this.compareDateForm.dateRange2 = [];
                this.compareDateForm.dateRange2.push(result[1].startDate);
                this.compareDateForm.dateRange2.push(result[1].endDate);

                this.compareDateForm.dateRange3 = [];
                this.compareDateForm.dateRange3.push(result[2].startDate);
                this.compareDateForm.dateRange3.push(result[2].endDate);
            })
        },
        getLast2Month() {
            getLastNMonth(2).then(data => {
                let result = data.body;
                this.compareDateForm.dateRange1 = [];
                this.compareDateForm.dateRange1.push(result[0].startDate);
                this.compareDateForm.dateRange1.push(result[0].endDate);

                this.compareDateForm.dateRange2 = [];
                this.compareDateForm.dateRange2.push(result[1].startDate);
                this.compareDateForm.dateRange2.push(result[1].endDate);

                this.compareDateForm.dateRange3 = [];
            })
        },
        getLast3Month() {
            getLastNMonth(3).then(data => {
                let result = data.body;
                this.compareDateForm.dateRange1 = [];
                this.compareDateForm.dateRange1.push(result[0].startDate);
                this.compareDateForm.dateRange1.push(result[0].endDate);

                this.compareDateForm.dateRange2 = [];
                this.compareDateForm.dateRange2.push(result[1].startDate);
                this.compareDateForm.dateRange2.push(result[1].endDate);

                this.compareDateForm.dateRange3 = [];
                this.compareDateForm.dateRange3.push(result[2].startDate);
                this.compareDateForm.dateRange3.push(result[2].endDate);
            })
        },
        // 确认同步
        syncConfirm() {
            if (!this.syncForm.daysType) {
                this.$message({
                    type: 'error',
                    message: '请选择同步日期!'
                });
                return;
            }
            if (this.syncForm.itemList.length === 0) {
                this.$message({
                    type: 'error',
                    message: '请至少选择一个项目同步!'
                });
                return;
            }
            this.syncForm.shopId = this.shopId;
            if (this.syncForm.daysType === 'USER_DEFINE') {
                this.syncForm.startDate = this.syncForm.dateRange[0];
                this.syncForm.endDate = this.syncForm.dateRange[1];
            }
            syncDpShopData(this.syncForm).then(data => {
                if (data.respCode == 1000) {
                    this.$message({
                        type: 'success',
                        message: '提交同步请求成功，系统正在后台同步数据，大约需要您等待1-2分钟!'
                    });
                    this.syncDialogVisible = false;
                }
            })
        },
        clearCache(row) {
            this.$confirm('请确认是否清除缓存, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                clearDpCache({shopId: row.shopId}).then(data => {
                    this.$message({
                        type: 'success',
                        message: '清除成功!'
                    });
                })
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消'
                });
            });
        },
        compareShop() {
            this.compareShopDialogVisible = true;
            getAllShops().then(data => {
                this.allShops = data.body;
            })
        },
        compareShopConfirm() {
            // 跳转数据分析页面
            this.compareShopDialogVisible = false;
            let url = window.location.href;
            let tt = url.split("#");
            let shopIds = this.compareShopForm.shopIds;
            shopIds.unshift(this.dpShop.shopId)
            // 设置默认日期为最近一个礼拜
            let endDate = this.GLOBAL.getFormatDate(new Date(new Date().getTime() - 1000 * 60 * 60 * 24));
            let startDate = this.GLOBAL.getFormatDate(new Date(new Date().getTime() - 1000 * 60 * 60 * 24 * 7));
            window.open(tt[0] + '#/dp/shop/compareByShop?shopIds=' + shopIds.join(",") + '&startDate=' + startDate + '&endDate=' + endDate, '_blank');
        },
        compareDate() {
            this.compareDateDialogVisible = true;
        },
        compareDateConfirm() {
            // 跳转数据分析页面
            this.compareDateDialogVisible = false;
            let url = window.location.href;
            let tt = url.split("#");
            let shopId = this.dpShop.shopId;
            console.log(this.compareDateForm)
            let startDate1 = null;
            let endDate1 = null;
            let startDate2 = null;
            let endDate2 = null;
            let startDate3 = null;
            let endDate3 = null;
            if (this.compareDateForm.dateRange1) {
                startDate1 = this.compareDateForm.dateRange1[0];
                endDate1 = this.compareDateForm.dateRange1[1];
            }
            if (this.compareDateForm.dateRange2) {
                startDate2 = this.compareDateForm.dateRange2[0];
                endDate2 = this.compareDateForm.dateRange2[1];
            }
            if (this.compareDateForm.dateRange3) {
                if (this.compareDateForm.dateRange3.length === 2) {
                    startDate3 = this.compareDateForm.dateRange3[0];
                    endDate3 = this.compareDateForm.dateRange3[1];
                }
            }
            // 设置默认日期为最近一个礼拜
            window.open(tt[0] + '#/dp/shop/compareByDate?shopId=' + shopId + '&startDate1=' + startDate1 + '&endDate1=' + endDate1 + '&startDate2=' + startDate2 + '&endDate2=' + endDate2 + '&startDate3=' + startDate3 + '&endDate3=' + endDate3, '_blank');
        },
        handleTabClick(tab, event) {
            let href = window.location.href;
            if (href.indexOf(tab.name) === -1) {
                this.$router.replace({query: {shopId: this.shopId, tab: tab.name}});
            }
        },
        getShopService() {
            let url = "https://m.dianping.com/wxmapi/shop/shopservice?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getRankInfo() {
            let url = "https://m.dianping.com/wxmapi/shop/rankinfo?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getShopTuan() {
            let url = "https://m.dianping.com/wxmapi/shop/shoptuan?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getShopMenu() {
            let url = "https://m.dianping.com/wxmapi/shop/shopmenu?shopId=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getShopInfo() {
            let url = "https://m.dianping.com/wxmapi/shop/shopinfo?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getShopBin() {
            let url = "https://mapi.dianping.com/mapi/msource/shop.bin?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getShopOther() {
            let url = "https://m.dianping.com/wxmapi/shop/shopother?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        getShopCooperation() {
            let url = "https://m.dianping.com/wxmapi/shop/cooperation?shopUuid=" + this.dpShop.shopUuid;
            window.open('javascript:window.name;', '<script>location.replace("' + url + '")<\/script>');
        },
        viewAnalysis() {
            // 跳转数据分析页面
            let url = window.location.href;
            let tt = url.split("#");
            // 设置默认日期为最近一个礼拜
            let endDate = this.GLOBAL.getFormatDate(new Date(new Date().getTime() - 1000 * 60 * 60 * 24));
            let startDate = this.GLOBAL.getFormatDate(new Date(new Date().getTime() - 1000 * 60 * 60 * 24 * 7));
            window.open(tt[0] + '#/dp/shop/analysis?shopId=' + this.dpShop.shopId + '&startDate=' + startDate + '&endDate=' + endDate, '_blank');
        },
        viewSummary() {
            // 跳转数据分析页面
            let url = window.location.href;
            let tt = url.split("#");
            // 设置默认日期为最近一个礼拜
            let endDate = this.GLOBAL.getFormatDate(new Date(new Date().getTime() - 1000 * 60 * 60 * 24));
            let startDate = this.GLOBAL.getFormatDate(new Date(new Date().getTime() - 1000 * 60 * 60 * 24 * 7));
            window.open(tt[0] + '#/dp/shop/summary?shopId=' + this.dpShop.shopId + '&startDate=' + startDate + '&endDate=' + endDate, '_blank');
        },
        onRefresh: function (row) {
            this.$confirm('请确认是否刷新, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                refreshDpShop({id: row.id}).then(data => {
                    if (data.respCode == 1000) {
                        this.$message({
                            type: 'success',
                            message: '刷新成功!'
                        });
                        this.getData();
                    }
                })
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消'
                });
            });
        },
        clickStyleTag(item) {
            if (item.effect === 'plain') {
                item.effect = 'dark'
            } else {
                item.effect = 'plain'
            }
            let ss = [];
            this.style_tags.forEach((item, index, arr) => {
                if (item.effect === 'dark') {
                    ss.push(item.label);
                }
            })
            if (ss.length > 0) {
                this.galleryAddForm.styleTags = ss.join(",");
            }
        },
        clickContentTag(item) {
            if (item.effect === 'plain') {
                item.effect = 'dark'
            } else {
                item.effect = 'plain'
            }
            let ss = [];
            this.content_tags.forEach((item, index, arr) => {
                if (item.effect === 'dark') {
                    ss.push(item.label);
                }
            })
            if (ss.length > 0) {
                this.galleryAddForm.contentTags = ss.join(",");
            }
        },
        menuAdd(cols) {
            this.menuSelectedRow = cols
            this.galleryAdd5Pic('MENU');
        },
        // 添加5图
        galleryAdd5Pic(category) {
            // 风格标签初始化
            this.style_tags.forEach((item, index, arr) => {
                item.effect = 'plain'
            })
            this.galleryAdd5PicDialogVisible = true;
            this.galleryAddForm.shopName = this.dpShop.shopName;
            this.galleryAddForm.category = category;
            this.galleryAddForm.foodCategory = this.dpShop.categoryName;
            if (category === 'FIVE_PIC') {
                this.galleryAdd5PicTitle = '五图添加到相册'
            } else if (category === 'MENU') {
                this.galleryAdd5PicTitle = '菜单添加到相册'
            }
            this.getShopCategories();
            this.getStyleTags();
        },
        // 添加5图确认
        galleryAdd5PicConfirm() {
            let data = [];
            if (this.galleryAddForm.category === 'FIVE_PIC') {
                this.pics.forEach((item, index, arr) => {
                    let param = {};
                    param.mediaUrl = item.thumbUrl;
                    param.source = 'DP';
                    param.type = 'IMAGE';
                    param.name = item.name;
                    param.shopName = this.galleryAddForm.shopName;
                    param.foodCategory = this.galleryAddForm.foodCategory;
                    param.styleTags = this.galleryAddForm.styleTags;
                    param.category = this.galleryAddForm.category;
                    param.dp5picFlag = true;
                    data.push(param);
                })
                addFromDp5pic(data).then(data => {
                    if (data.respCode == 1000) {
                        this.$message({
                            type: 'success',
                            message: '添加成功!'
                        });
                        this.galleryAdd5PicDialogVisible = false;
                    }
                })
            } else if (this.galleryAddForm.category === 'MENU') {
                this.menuSelectedRow.forEach((item, index, arr) => {
                    let param = {};
                    param.mediaUrl = item;
                    param.source = 'DP';
                    param.type = 'IMAGE';
                    param.name = item.name;
                    param.shopName = this.galleryAddForm.shopName;
                    param.foodCategory = this.galleryAddForm.foodCategory;
                    param.styleTags = this.galleryAddForm.styleTags;
                    param.category = this.galleryAddForm.category;
                    param.dp5picFlag = true;
                    data.push(param);
                })
                addFromDpMenu(data).then(data => {
                    if (data.respCode == 1000) {
                        this.$message({
                            type: 'success',
                            message: '添加成功!'
                        });
                        this.galleryAdd5PicDialogVisible = false;
                    }
                })
            }
        },
        // 添加视频
        galleryAddVideo() {
            if (this.videoUrl) {
                this.galleryAddDialogVisible = true;
                this.galleryAddForm.mediaUrl = this.videoUrl;
                this.galleryAddForm.source = 'DP';
                this.galleryAddForm.type = 'VIDEO';
                this.galleryAddForm.category = 'FOOD';
                this.galleryAddForm.name = this.dpShop.shopName + '商家视频';
                this.galleryAddForm.shopName = this.dpShop.shopName;
                this.galleryAddForm.dp5picFlag = false;
                this.galleryAddForm.foodCategory = this.dpShop.categoryName;
                this.getShopCategories();
                this.getStyleTags();
            } else {
                this.$message({
                    type: 'error',
                    message: '暂时没有视频!'
                });
            }
        },
        // 添加招牌菜
        galleryAddImage(row) {
            // 风格标签初始化
            this.style_tags.forEach((item, index, arr) => {
                item.effect = 'plain'
            })
            // 内容标签初始化
            this.content_tags.forEach((item, index, arr) => {
                item.effect = 'plain'
            })
            this.galleryAddDialogVisible = true;
            this.galleryAddForm.mediaUrl = row.imgUrl;
            this.galleryAddForm.source = 'DP';
            this.galleryAddForm.type = 'IMAGE';
            this.galleryAddForm.category = 'FOOD';
            this.galleryAddForm.name = row.name;
            this.galleryAddForm.shopName = this.dpShop.shopName;
            this.galleryAddForm.dp5picFlag = false;
            this.galleryAddForm.foodCategory = this.dpShop.categoryName;

            this.getShopCategories();
            this.getStyleTags();
            this.getContentTags();
        },
        // 添加确认
        galleryAddConfirm() {
            addGalleryFromDp(this.galleryAddForm).then(data => {
                if (data.respCode == 1000) {
                    this.$message({
                        type: 'success',
                        message: '添加成功!'
                    });
                    this.galleryAddDialogVisible = false;
                }
            })
        },
        // 点击榜单
        clickRank() {
            if (this.dpShop.rankKey) {
                let _this = this;
                getDpRankByRankKey({'rankKey': this.dpShop.rankKey}).then(data => {
                    if (data.respCode == 1000) {
                        if (data.body) {
                            // 有榜单
                            this.$router.push({path: '/dp/rank/detail', query: {id: data.body.id}});
                        } else {
                            // 无榜单
                            this.$confirm('系统暂时没有添加该榜单，是否添加?', '提示', {
                                confirmButtonText: '确定',
                                cancelButtonText: '取消',
                                type: 'warning'
                            }).then(() => {
                                _this.addRank();
                            }).catch(() => {
                                this.$message({
                                    type: 'info',
                                    message: '已取消'
                                });
                            });
                        }
                    }
                })
            } else {
                this.$message({
                    type: 'error',
                    message: '该榜单暂时不支持点击!'
                });
            }
        },
        // 添加榜单
        addRank() {
            parseDpRankInfo({'shopId': this.shopId}).then(data => {
                if (data.respCode == 1000) {
                    this.addRankForm = data.body;
                    this.addRankDialogVisible = true;
                }
            })
        },
        // 添加榜单确定
        addRankConfirm() {
            addDpRank(this.addRankForm).then(data => {
                if (data.respCode == 1000) {
                    this.addRankDialogVisible = false;
                    this.$message({
                        type: 'success',
                        message: '添加成功，请到榜单页面查看!'
                    });
                }
            });
        },
        changeFeedbackStatus() {
            if (!this.dpShop.reserveCookie) {
                this.$message({
                    type: 'error',
                    message: '请先配置Cookie!'
                });
                this.dpShop.syncFeedbackStatus = false;
                return;
            }
            updateDpShop(this.dpShop).then(data => {
                if (data.respCode == 1000) {
                    this.getData();
                }
            });
        },
        changeStatus() {
            updateDpShop(this.dpShop).then(data => {
                if (data.respCode == 1000) {
                    this.getData();
                }
            });
        },
        setCookie() {
            // Cookie
            if (this.dpShop.promotionCookieAvailable != null) {
                if (!this.dpShop.promotionCookieAvailable) {
                    this.promotionCookieLabel = "推广通Cookie(已失效)";
                    this.cookieForm.promotionCookie = null;
                }
            }
            if (this.dpShop.reserveCookieAvailable != null) {
                if (!this.dpShop.reserveCookieAvailable) {
                    this.reserveCookieLabel = "评价Cookie(已失效)";
                }
            }
            this.cookieDialogVisible = true;
            this.cookieForm.reserveCookie = this.dpShop.reserveCookie;
            this.cookieForm.promotionCookie = this.dpShop.promotionCookie;
            this.cookieForm.poiId = this.dpShop.poiId;
            this.cookieForm.feedbackIntervalDays = this.dpShop.feedbackIntervalDays;

            this.cookieForm.extraField1 = this.dpShop.extraField1;
            this.cookieForm.extraField2 = this.dpShop.extraField2;
            this.cookieForm.extraField3 = this.dpShop.extraField3;
            this.cookieForm.extraField4 = this.dpShop.extraField4;
            this.cookieForm.extraField5 = this.dpShop.extraField5;

            getAllShops().then(data => {
                this.allShops = data.body;
            })
        },
        setCookieConfirm() {
            this.cookieForm.id = this.dpShop.id;
            if (this.cookieForm.shopIdList.length > 0) {
                this.cookieForm.shopIds = this.cookieForm.shopIdList.join(",")
            }
            updateDpShopParam(this.cookieForm).then(data => {
                if (data.respCode == 1000) {
                    this.cookieDialogVisible = false;
                    this.getData();
                }
            });
        },
        syncReserveConfirm() {
            this.syncReserveForm.id = this.dpShop.id;
            syncDpShopReserveData(this.syncReserveForm).then(data => {
                if (data.respCode == 1000) {
                    this.$message({
                        type: 'success',
                        message: '提交同步请求成功，系统正在后台同步预定数据，请不要重复提交哦!'
                    });
                    this.syncReserveDialogVisible = false;
                    this.getData();
                }
            });
        },
        syncFeedbackConfirm() {
            this.syncFeedbackForm.id = this.dpShop.id;
            syncDpShopFeedbackData(this.syncFeedbackForm).then(data => {
                if (data.respCode == 1000) {
                    this.$message({
                        type: 'success',
                        message: '提交同步请求成功，系统正在后台同步评价数据，请不要重复提交哦!'
                    });
                    this.syncFeedbackDialogVisible = false;
                    this.getData();
                }
            });
        },
        syncSpecialConfirm() {
            this.syncReserveForm.id = this.dpShop.id;
            syncDpShopSpecialDish(this.syncReserveForm).then(data => {
                if (data.respCode == 1000) {
                    this.$message({
                        type: 'success',
                        message: '同步成功!'
                    });
                    this.syncSpecialDialogVisible = false;
                    this.getData();
                }
            });
        },
        syncMenu() {
            syncDpShopMenu({id: this.dpShop.id}).then(data => {
                if (data.respCode == 1000) {
                    this.$message({
                        type: 'success',
                        message: '同步成功!'
                    });
                    this.getData();
                }
            });
        },
        viewCpc() {
            let params = {'shopId': this.shopId};
            viewCpcNow(params).then(data => {
                if (data.respCode == 1000) {
                    this.cpcDialogTitle = this.dpShop.shopName + "CPC竞价信息-" + this.dpShop.cityName;
                    this.cpcViewDialogVisible = true;
                    this.cpcInfo = data.body;
                }
            })
        },
        getData() {
            getDpShopByShopId({"shopId": this.shopId}).then(data => {
                this.dpShop = data.body;
                this.syncReserveForm.startDate = this.dpShop.lastReserveEndDate;
                this.syncReserveForm.lastReserveEndDate = this.dpShop.lastReserveEndDate;
                this.syncFeedbackForm.startDate = this.dpShop.lastFeedbackEndDate;
                this.syncFeedbackForm.lastFeedbackEndDate = this.dpShop.lastFeedbackEndDate;
                // 5图
                this.pics = JSON.parse(data.body.pics);
                if (this.pics.length > 0) {
                    this.videoUrl = this.pics[0].scheme;
                }
                this.pics.forEach((item, index, arr) => {
                    this.picUrls.push(item.thumbUrl);
                })
                // 菜单
                if (data.body.menu) {
                    this.menuImgUrls = JSON.parse(data.body.menu);
                    if (this.menuImgUrls.length > 0) {
                        this.menuRowsData = this.GLOBAL.convertArray(this.menuImgUrls, 4);
                    }
                }
            })
            this.getSpecialDishes();
        },
        // 获取招牌菜
        getSpecialDishes() {
            let condition = {
                page: 1,
                rows: 25,
                search: {
                    shopId: this.shopId
                }
            };
            getDpSpecialDishByPage(condition).then(data => {
                this.specialDishes = data.body.rows;
                this.specialDishes.forEach((item, index, arr) => {
                    this.specialImgUrls.push(item.imgUrl);
                })

                this.specialRowsData = this.GLOBAL.convertArray(this.specialDishes, this.colsSize);
            })
        },
        // 获取风格标签数组
        getStyleTags() {
            if (this.style_tags.length > 0) {
                return;
            }
            this.style_tags = [];
            getParamValue('gallery_style_tags').then(data => {
                let ss = data.body;
                if (ss) {
                    let tt = ss.split(",");
                    tt.forEach((item, index, arr) => {
                        this.style_tags.push(
                            {
                                type: '',
                                label: item,
                                effect: 'plain'
                            }
                        )
                    })
                }
            })
        },
        // 获取内容标签数组
        getContentTags() {
            if (this.content_tags.length > 0) {
                return;
            }
            this.content_tags = [];
            getParamValue('gallery_content_tags').then(data => {
                let ss = data.body;
                if (ss) {
                    let tt = ss.split(",");
                    tt.forEach((item, index, arr) => {
                        this.content_tags.push(
                            {
                                type: 'success',
                                label: item,
                                effect: 'plain'
                            }
                        )
                    })
                }
            })
        },
        // 获取门店分类
        getShopCategories() {
            if (this.shop_categories.length > 0) {
                return;
            }
            this.shop_categories = [];
            getParamValue('food_shop_category').then(data => {
                let ss = data.body;
                if (ss) {
                    let tt = ss.split(",");
                    tt.forEach((item, index, arr) => {
                        this.shop_categories.push(
                            {
                                value: item,
                                label: item,
                            }
                        )
                    })
                }
            })
        },
        goBack() {
            // 编程式导航
            this.$router.go(-1);
        },
    },
    created() {
        this.shopId = this.$route.query.shopId;
        let tab = this.$route.query.tab;
        if (tab) {
            this.activeName = tab;
        }
        this.getData();
    },
}
</script>

<style scoped>
.el-input {
    width: 150px !important;
}

.el-select {
    width: 150px !important;
}

.pics {
    width: 1200px;
}

.pic {
    width: 200px;
    height: 150px;
}

.menu-pics {
    width: 960px;
}

.menu-pic {
    width: 160px;
    height: 90px;
}

.el-button--mini.is-circle {
    padding: 0px !important;
}

.el-tag {
    cursor: default !important;
}

.el-tag:hover {
    cursor: pointer !important;
}
</style>
